<template>
	<view style="padding-bottom: 30rpx;">
		<!-- 流水明细的显示  -->
		<view style="position: fixed;top:70rpx;background-color: white;width: 100%;">
			<view
				style="display: flex;flex-direction: row;align-items: center;justify-content: space-between;margin: 25rpx 30rpx;font-size: 25rpx;">
				<view >
					卡号
				</view>
				<view>
					卡状态
				</view>
				<view>
					剩余次数
				</view>
				<view>
					类型
				</view>
				<view>
					下次兑换时间
				</view>
				<view>
					有效期
				</view>
			</view>
		</view>
		<view v-if="lipinkalist.length"
			style="display: flex;font-size: 25rpx;padding-bottom:10rpx; box-shadow: 1px 1px 5px #c2c2c2;border-radius: 15rpx; width: 730rpx;margin:80rpx auto 50rpx auto;flex-direction: column;">
			
			<view v-for="(item,index) in lipinkalist" :key="index" >
				<view
					style="display: flex;flex-direction: row;align-items: center;justify-content: space-between;margin: 20rpx 35rpx;">
					<view>
						{{item.kahao}}
					</view>
					<view :style="{ color: item.kazhuangtai === 0 ? 'red' : 'green' }">  
					  {{ item.kazhuangtai === 0 ? "无效" : "正常" }}  
					</view>  
					<view>
						{{item.kazhuangtai === 0 ?"":item.shengyu}}
					</view>
					<view>
						{{item.kazhuangtai === 0 ?"":item.leixing}}
					</view>
					
					<view style="font-size: 23rpx;">
						{{item.kazhuangtai === 0 ?"":item.next_duihuantime ?item.next_duihuantime.slice(2, 10): "随时可兑"}}
					</view>
					<view style="font-size: 23rpx;">
						{{item.kazhuangtai === 0 ?"":item.youxiaoqi.slice(2, 10)}}
					</view>
				</view>
				<view v-if="lipinkalist.length!=index+1" style="display:flex;width: 700rpx;height: 2rpx;margin: 0 auto;background-color: lightgray;">
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				lipinkalist: []
			}
		},
		onLoad(option) {
			if (option.current == 0) {
				uni.showLoading({
					title: "查询中……"
				})
				// 将this.kahao放入数组shuju中
				const shuju = [option.kahao]
				uniCloud.callFunction({
					name: "fun1",
					data: {
						leixing: 3,
						kahao: shuju
					}
				}).then(res => {
					uni.hideLoading()
					this.lipinkalist = res.result.data
					console.log("5", res);
				})
			} else if (option.current == 1) {
				uni.showLoading({
					title: "查询中……"
				})
				// 将this.kahao_duo按小写或大写的，分隔，放入数组shuju中
				const shuju = option.kahao_duo.split(/[，, ]/).filter(item => item.trim() !== '');
				uniCloud.callFunction({
					name: "fun1",
					data: {
						leixing: 3,
						kahao: shuju
					}
				}).then(res => {
					uni.hideLoading()
					this.lipinkalist = res.result.data
					console.log("5", res);
				})
			} else {
				uni.showLoading({
					title: "查询中……"
				})
				// 步骤1：提取前缀和后5位数字
				const prefix = String(option.kahao_start).slice(0, -5); // 保留前缀
				const start = parseInt(String(option.kahao_start).slice(-5), 10); // 后5位转数字
				const end = parseInt(String(option.kahao_end).slice(-5), 10);
				// 步骤2：生成连续数字并补位
				const numArray = [];
				for (let i = Math.min(start, end); i <= Math.max(start, end); i++) {
					numArray.push(i.toString().padStart(5, '0')); // 强制补足5位
				}
				// 步骤3：拼接原始前缀
				const shuju = numArray.map(num => prefix + num);

				uniCloud.callFunction({
					name: "fun1",
					data: {
						leixing: 3,
						kahao: shuju
					}
				}).then(res => {
					uni.hideLoading()
					this.lipinkalist = res.result.data
					console.log("5", res);
				})
			}
		},
		methods: {

		}
	}
</script>

<style>

</style>